// Step 7 (Final): Change the app's theme

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
import 'package:Lter/screens/data/phone_screen.dart';

class NavDataScreen extends StatefulWidget {
  NavDataScreen({Key key}) : super(key: key);

  @override
  createState() => NavDataScreenState();
}

class NavDataScreenState extends State<NavDataScreen> {
  final _suggestions = <WordPair>[];

  final _saved = Set<WordPair>();

  final _biggerFont = const TextStyle(fontSize: 18.0);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: choices.length,
        child: Scaffold(
          appBar: AppBar(
            title: Text('Reported Data'),
            bottom: TabBar(
              //isScrollable: true,
              tabs: choices.map((Choice choice) {
                return Tab(
                  text: choice.title,
                  icon: Icon(choice.icon),
                );
              }).toList(),
            ),
          ),
          body: TabBarView(
            children: choices.map((Choice choice) {
              return Padding(
                padding: EdgeInsets.only(top: 0),
                child: _buildSuggestions(choice),
              );
            }).toList(),
          ),
        ),
      ),
    );
  }

  Widget _buildSuggestions(Choice choice) {
    if (choice.title == "Phone") {
      return PhoneScreen();
    } else {
      return _buildDemoSuggestions();
    }
  }

  Widget _buildDemoSuggestions() {
    return ListView.builder(
      padding: EdgeInsets.only(top: 0),
      itemBuilder: (context, i) {
        if (i.isOdd) return Divider();

        final index = i ~/ 2;
        if (index >= _suggestions.length) {
          _suggestions.addAll(generateWordPairs().take(10));
        }
        return _buildRow(_suggestions[index]);
      },
    );
  }

  Widget _buildRow(WordPair pair) {
    final alreadySaved = _saved.contains(pair);
    return ListTile(
      title: Text(
        pair.asPascalCase,
        style: _biggerFont,
      ),
      trailing: Icon(
        alreadySaved ? Icons.favorite : Icons.favorite_border,
        color: alreadySaved ? Colors.red : null,
      ),
      onTap: () {
        setState(
          () {
            if (alreadySaved) {
              _saved.remove(pair);
            } else {
              _saved.add(pair);
            }
          },
        );
      },
    );
  }
}

class Choice {
  const Choice({this.title, this.icon});
  final String title;
  final IconData icon;
}

const List<Choice> choices = const <Choice>[
  const Choice(title: 'Phone', icon: Icons.account_circle),
  const Choice(title: 'Call', icon: Icons.phone_in_talk),
  const Choice(title: 'Message', icon: Icons.message),
];
